<template>
  <div class="basic-container">
    <SpecialApprovInfo
      v-if="data.specialApprove===1"
      :special-info="data"
    />
    <InfoCard title="基础信息" :list="basicInfo" />
    <InfoCard title="客户授信信息" :list="creditInfo" :style="style" />
    <div style="margin-top: 22px; font-size: 14px">
      <Title title="产品明细" />
      <div style="padding: 6px;">
        <header style="margin: 8px 0;">订单产品清单：</header>
        <BaseTable
          :table-data="data.salesProductApplyDTO"
          :table-list="orderTableList"
          :get-summaries="getOrderSummaries"
        />
        <header style="margin: 8px 0;">本次发货清单：</header>
        <BaseTable
          :table-data="productList"
          :table-list="productTableList"
          :get-summaries="getProductSummaries"
        />
      </div>
    </div>
    <div class="d-flex justify-content-end align-items-center" style="font-size: 14px; margin-top: 22px">
      <div style="margin-right: 30px">
        <span>税额：</span>
        <span>{{ `${data.currencyCode} ${formatMoneyAmount(totalTaxAmount)}` }}</span>
      </div>
      <div style="font-weight: bold">
        <span>申请总额：</span>
        <span>{{ `${data.currencyCode} ${formatMoneyAmount(totalApplyAmount)}` }}</span>
      </div>
    </div>
    <Title title="付款方式" style="font-size: 14px; margin-top: 22px" />
    <el-row :gutter="12" class="delivery-info">
      <el-col :span="12">
        <span>首款（TT）：</span>
        <span>{{ percentAmount(applyPaymentOutDTO.downPayment) }}</span>
      </el-col>
      <el-col :span="12">
        <span>尾款：</span>
        <span>{{ percentAmount(applyPaymentOutDTO.balancePayment) }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>账期/天：</span>
        <span>{{ applyPaymentOutDTO.accountPeriod }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>实际首付款：</span>
        <span>{{ percentAmount(applyPaymentOutDTO.downPaymentActual) }}</span>
        <span>{{ applyPaymentOutDTO.checkingStatus ? `（${amountAndCurrenyHandler(applyPaymentOutDTO.currencyCode, applyPaymentOutDTO.downPaymentActualAmount )}）` : '（/）' }}</span>
        <span class="highlight-font">{{ checkingStatusText(applyPaymentOutDTO.checkingStatus, checking_status) }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>待核账金额：</span>
        <span>{{ amountAndCurrenyHandler(applyPaymentOutDTO.currencyCode, applyPaymentOutDTO.unWrittenAmount ) }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>已核账金额：</span>
        <span>{{ applyPaymentOutDTO.checkingStatus ? amountAndCurrenyHandler(applyPaymentOutDTO.currencyCode, applyPaymentOutDTO.writeAmount ): '/' }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>占用中的返点：</span>
        <span>{{ amountAndCurrenyHandler(applyPaymentOutDTO.currencyCode, applyPaymentOutDTO.rebateOccupy) }}</span>
        <span>{{ `（${amountAndCurrenyHandler('USD', applyPaymentOutDTO.rebateOccupyUsd)}）` }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>已使用的返点：</span>
        <span>{{ applyPaymentOutDTO.checkingStatus ? amountAndCurrenyHandler(applyPaymentOutDTO.currencyCode, applyPaymentOutDTO.rebateUsed) : '/' }}</span>
        <span>{{ applyPaymentOutDTO.checkingStatus ? `（${amountAndCurrenyHandler('USD', applyPaymentOutDTO.rebateUsedUsd)}）`: '（/）' }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>占用中的授信：</span>
        <span>{{ amountAndCurrenyHandler(applyPaymentOutDTO.currencyCode, applyPaymentOutDTO.creditOccupy) }}</span>
        <span>{{ `（${amountAndCurrenyHandler('USD', applyPaymentOutDTO.creditOccupyUsd)}）` }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>已释放的授信：</span>
        <span>{{ applyPaymentOutDTO.checkingStatus ? amountAndCurrenyHandler(applyPaymentOutDTO.currencyCode, applyPaymentOutDTO.creditUsed): '/' }}</span>
        <span>{{ applyPaymentOutDTO.checkingStatus ? `（${amountAndCurrenyHandler('USD', applyPaymentOutDTO.creditUsedUsd)}）` : '（/）' }}</span>
      </el-col>
    </el-row>
    <Title title="收/发货信息" style="font-size: 14px; margin-top: 22px">
      <span style="color: #0072FF; cursor: pointer;" @click="changeRecord">变更记录</span>
    </Title>
    <el-row :gutter="12" class="delivery-info">
      <el-col :span="24">
        <span style="font-size: 18px">客户收货信息：</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>国家：</span>
        <span>{{ getDictionaryLabel(receiveInfo.countryCode, country_code) }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>商业注册登记号：</span>
        <span>{{ receiveInfo.businessRegistrationNo }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>收货人：</span>
        <span>{{ receiveInfo.consignee }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>公司名称：</span>
        <span>{{ receiveInfo.companyName }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>电话/手机：</span>
        <span>{{ receiveInfo.phone }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>收货地址：</span>
        <span>{{ receiveInfo.receivingAddress }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>邮编：</span>
        <span>{{ receiveInfo.postCode }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>邮箱：</span>
        <span>{{ receiveInfo.email }}</span>
      </el-col>
      <div v-if="data.hasThirdReceiveInfo">
        <el-col :span="24" style="margin-top: 22px">
          <span style="font-size: 18px">第三方收货信息：</span>
        </el-col>
        <el-col :span="12" style="margin-top: 22px">
          <span>国家：</span>
          <span>{{ getDictionaryLabel(thirdReceiveInfo.countryCode, country_code) }}</span>
        </el-col>
        <el-col :span="12" style="margin-top: 22px">
          <span>收货人：</span>
          <span>{{ thirdReceiveInfo.consignee }}</span>
        </el-col>
        <el-col :span="12" style="margin-top: 22px">
          <span>公司名称：</span>
          <span>{{ thirdReceiveInfo.companyName }}</span>
        </el-col>
        <el-col :span="12" style="margin-top: 22px">
          <span>电话/手机：</span>
          <span>{{ thirdReceiveInfo.phone }}</span>
        </el-col>
        <el-col :span="12" style="margin-top: 22px">
          <span>收货地址：</span>
          <span>{{ thirdReceiveInfo.receivingAddress }}</span>
        </el-col>
        <el-col :span="12" style="margin-top: 22px">
          <span>邮编：</span>
          <span>{{ thirdReceiveInfo.postCode }}</span>
        </el-col>
        <el-col :span="12" style="margin-top: 22px">
          <span>邮箱：</span>
          <span>{{ thirdReceiveInfo.email }}</span>
        </el-col>
      </div>
      <el-col :span="24" style="margin-top: 22px">
        <span style="font-size: 18px">发货信息：</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>贸易术语：</span>
        <span>{{ getDictionaryLabel(deliverInfo.tradeTerms, trade_terms) }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>发货仓库：</span>
        <span>{{ getDictionaryLabel(deliverInfo.deliveryWarehouseCode, delivery_warehouse) }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>运输方式：</span>
        <span>{{ getDictionaryLabel(deliverInfo.transportType, transport_type) }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>货代方式：</span>
        <span>{{ getDictionaryLabel(deliverInfo.forwarderType, forwarder_type) }}</span>
      </el-col>

      <div
        v-if="deliverInfo.forwarderType === '我司货代'"
      >
        <el-col :span="12" style="margin-top: 22px">
          <span>我司货代询价：</span>
          <span>{{ formatMoneyAmount(deliverInfo.forwarderInquiry) }}</span>
        </el-col>
        <el-col :span="12" style="margin-top: 22px">
          <span>我司货代询价币种：</span>
          <span>{{ getDictionaryLabel(deliverInfo.forwarderInquiryCurrency, currency) }}</span>
        </el-col>
        <el-col :span="12" style="margin-top: 22px">
          <span>我司货代交付地：</span>
          <span>{{ deliverInfo.forwarderDeliveryPlace }}</span>
        </el-col>
      </div>

      <div
        v-if="deliverInfo.forwarderType === '客户货代'"
      >
        <el-col :span="12" style="margin-top: 22px">
          <span>客户货代公司：</span>
          <span>{{ deliverInfo.forwarderCompany }}</span>
        </el-col>
        <el-col :span="12" style="margin-top: 22px">
          <span>客户货代联系人：</span>
          <span>{{ deliverInfo.forwarderContact }}</span>
        </el-col>
        <el-col :span="12" style="margin-top: 22px">
          <span>客户货代联系电话：</span>
          <span>{{ deliverInfo.forwarderPhone }}</span>
        </el-col>
        <el-col :span="12" style="margin-top: 22px">
          <span>客户货代联系邮箱：</span>
          <span>{{ deliverInfo.forwarderEmail }}</span>
        </el-col>
      </div>

      <el-col :span="12" style="margin-top: 22px">
        <span>唛头：</span>
        <span>{{ deliverInfo.shippingMark }}</span>
      </el-col>
      <el-col :span="12" style="margin-top: 22px">
        <span>特殊文件说明：</span>
        <span>{{ deliverInfo.specialDocDesc }}</span>
      </el-col>

    </el-row>
    <InfoCard
      title="附件"
      :list="appendixList"
      is-appendix
      description="暂无附件"
      :style="style"
      @rePainDetail="rePainDetail"
    >
      <span style="color: #0072FF; cursor: pointer;" @click="showUpload">上传附件</span>
    </InfoCard>
    <InfoCard title="系统信息" :list="systemInfo" :style="style" />
    <el-dialog
      title="新增附件"
      width="40%"
      center
      :visible.sync="visible"
      :before-close="handleClose"
      :style="{height: '1000px'}"
      :show-close="false"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      @open="openUploadDialog"
    >
      <el-form
        ref="uploadForm"
        :rules="formRules"
        :model="uploadForm"
        label-width="150px"
      >
        <el-form-item label="附件：" prop="attachmentList">
          <PublicUpload
            :file-list="uploadForm.attachmentList"
            :limit="10 - uploadForm.attachmentList.length"
            @setFileList="setFileListHandle"
            @setUploadLoding="setUploadLoding"
          />
        </el-form-item>
      </el-form>
      <div>
        温馨提示：单个附件最大10M，累计限制上传10个，已有{{
          uploadForm.attachmentList.length
        }}个
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" :loading="uploadLoading" @click="onSubmit">确认</el-button>
        <el-button @click="closeDialogVisible">取消</el-button>
      </span>
    </el-dialog>

    <ChangeRecord
      :visible="changeRecordVisble"
      :page-info="pageInfo"
      :change-list="changeList"
      @closeDialog="closeChangeDialog"
      @pageChange="pageChangeHandle"
    />
  </div>
</template>

<script>
import InfoCard from './InfoCard'
import Title from '@/components/Title'
import BaseTable from '@/components/BaseTable'
import PublicUpload from '@/components/PublicUpload'
import SpecialApprovInfo from './SpecialApprovInfo'
import ChangeRecord from './ChangeRecord'
import { formatTime, isUndefined, formatUserName } from '@/utils/tools'
import { uploadAttachment, deliveryRecordList } from '@/service/ship'
import { getCreditInfo } from '@/service/accountManage'
import { mapState } from 'vuex'
import { getDictionaryLabel, formatMoneyAmount } from '@/utils/tools'

// 需考虑接口没数据情形
const getEngross = (approveNumber, notApproveNumber) => {
  const sum = parseFloat(approveNumber) + parseFloat(notApproveNumber)
  const str = `${formatMoneyAmount(sum)} （其中发货申请已审批部分${approveNumber}，未审批部分${notApproveNumber}）`
  return str
}

export default {
  name: 'BasicInfo',
  components: {
    InfoCard,
    BaseTable,
    Title,
    PublicUpload,
    SpecialApprovInfo,
    ChangeRecord
  },
  props: {
    data: {
      type: Object,
      required: true,
      default() {
        return {}
      }
    }
  },
  data() {
    return {
      gutter: 12,
      pageInfo: {
        total: 0,
        pageIndex: 1,
        pageSize: 2
      },
      changeList: [],
      style: {
        marginTop: '22px',
        marginBottom: '22px'
      },
      receiveInfo: {},
      thirdReceiveInfo: {},
      deliverInfo: {},
      applyPaymentOutDTO: {},
      specialAppendixList: [],
      basicInfo: [
        { label: '客户名称', value: '' },
        { label: '销售经理', value: '' },
        { label: '所属 PI', value: '' },
        { label: '所属订单', value: '' },
        { label: '关联发货计划', value: '' },
        { label: '国家', value: '' },
        { label: '普渡主体', value: '' },
        { label: '币种', value: '' },
        { label: '备注', value: '', style: { color: '#F56C6C' }}
      ],
      creditInfo: [
        { label: '中信保授信（美元）', value: '', span: 24, itemStyle: { fontSize: '18px' }},
        { label: '授信额度', value: '' },
        { label: '占用额度', value: '' },
        { label: '剩余额度', value: '' },
        { label: '授信有效截至日期', value: '' },
        { label: '公司授信（美元）', value: '', span: 24, itemStyle: { marginTop: '30px', fontSize: '18px' }},
        { label: '授信额度', value: '' },
        { label: '占用额度', value: '' },
        { label: '剩余额度', value: '' },
        { label: '授信有效截至日期', value: '' }
      ],
      chargeDetails: [
        { label: '产品总额', value: '1088' },
        { label: '消费税', value: '80' },
        { label: '物流费', value: '50' },
        { label: '税额', value: '10' },
        { label: '认证费', value: '20' },
        { label: '质保费', value: '20' },
        { label: '申请总额', value: '1180' }
      ],
      appendixList: [],
      systemInfo: [
        { label: '创建人', value: '' },
        { label: '创建时间', value: '' },
        { label: '更新人', value: '' },
        { label: '更新时间', value: '' }
      ],
      productList: [],
      orderTableList: [
        { label: 'SKU', prop: 'sku' },
        { label: '英文产品名', prop: 'englishProductName' },
        { label: '中文产品名', prop: 'productName' },
        { label: '产品型号', prop: 'productModel' },
        {
          label: '合同单价',
          prop: 'productPrice',
          render: (h, data) => {
            const { row, column: { prop }} = data
            const text = row.currencyCode ? `${row.currencyCode} ${formatMoneyAmount(row[prop])}` : `${this.data.currencyCode} ${formatMoneyAmount(row[prop])}`
            return <span>{text}</span>
          }
        },
        { label: '总数量', prop: 'productCount' },
        { label: '已申请发货数量', prop: 'applyQuantity' },
        { label: '已审核通过数量', prop: 'approvedQuantity' },
        { label: '已出货数量', prop: 'shippedQuantity' }
      ],
      totalTaxAmount: '', // 税额
      totalApplyAmount: '', // 申请总额
      loading: false,
      productTableList: [
        {
          label: 'SKU',
          prop: 'skuCode'
        },
        {
          label: '英文产品名',
          prop: 'productNameEn'
        },
        {
          label: '中文产品名',
          prop: 'productNameZh'
        },
        {
          label: '产品型号',
          prop: 'productModel'
        },
        {
          label: '合同单价',
          prop: 'contractUnitPrice',
          render: (h, data) => {
            const { row, column: { prop }} = data
            const text = row.currencyCode ? `${row.currencyCode} ${formatMoneyAmount(row[prop])}` : `${this.data.currencyCode} ${formatMoneyAmount(row[prop])}`
            return <span>{ text }</span>
          }
        },
        {
          label: '发货申请数量',
          prop: 'applyQuantity'
        },
        {
          label: '发货申请金额',
          prop: 'applyAmount',
          render: (h, data) => {
            const { row, column: { prop }} = data
            const text = row.currencyCode ? `${row.currencyCode} ${formatMoneyAmount(row[prop])}` : `${this.data.currencyCode} ${formatMoneyAmount(row[prop])}`
            return <span>{ text }</span>
          }
        },
        {
          label: '已出货数量',
          prop: 'shippedQuantity'
        }
      ],
      showPagination: false,
      visible: false,
      uploadForm: {
        attachmentList: []
      },
      formRules: {
        attachmentList: [
          { required: true, message: '请上传附件', trigger: 'change' }
        ]
      },
      uploadLoading: false,
      changeRecordVisble: false
    }
  },
  computed: {
    ...mapState({
      country_code: state => state.base.country_code,
      currency: state => state.base.currency,
      trade_terms: state => state.base.trade_terms,
      forwarder_type: state => state.base.forwarder_type,
      delivery_warehouse: state => state.base.delivery_warehouse,
      transport_type: state => state.base.transport_type,
      checking_status: state => state.base.checking_status
    })
  },
  watch: {
    data: {
      handler() {
        this.initDetailPage()
      },
      deep: true
    }
  },
  methods: {
    formatMoneyAmount,
    getDictionaryLabel,
    initDetailPage() {
      this.initBasicInfo()
      this.initCreditInfo()
      this.initPaymentInfo()
      this.initProductList()
      this.initReceiptInfo()
      this.initDeliveryInfo()
      this.initAppendixList()
      this.initSystemInfo()
      this.handleRecordList()
    },
    initBasicInfo() { // 初始化基本信息
      const { companyNameForeign, saleName, piNo, orderNo, deliveryPlanNo, countryCode, payeeName, currencyCode, remark } = this.data
      const arr = [companyNameForeign, saleName, piNo, orderNo, deliveryPlanNo, getDictionaryLabel(countryCode, this.country_code), payeeName, `${getDictionaryLabel(currencyCode, this.currency)}/${currencyCode}`, remark]
      arr.forEach((item, index) => {
        this.basicInfo[index].value = item || '-'
      })
    },
    initProductList() {
      const { orderItemList, totalTaxAmount, totalApplyAmount } = this.data
      this.productList = orderItemList
      this.totalTaxAmount = totalTaxAmount
      this.totalApplyAmount = totalApplyAmount
    },
    initReceiptInfo() { // 初始化收货信息
      if (!this.receiveInfo) return {}
      this.receiveInfo = this.data.receiveInfo
      this.thirdReceiveInfo = this.data.thirdReceiveInfo
    },
    initDeliveryInfo() { // 初始化发货信息
      if (!this.data.deliverInfo) return {}
      const { deliverInfo } = this.data
      this.deliverInfo = deliverInfo
    },
    initAppendixList() {
      const { attachmentList = [] } = this.data
      this.appendixList = attachmentList.map(item => {
        const { attachmentUrl, filename } = item
        return {
          ...item,
          url: attachmentUrl,
          filename,
          span: 24
        }
      })
    },
    initSystemInfo() {
      const { createUserName, createTime, updateUserName, updateTime } = this.data
      const arr = [formatUserName(createUserName), formatTime(createTime), formatUserName(updateUserName), formatTime(updateTime)]
      arr.forEach((item, index) => {
        this.systemInfo[index].value = item || '-'
      })
    },
    openUploadDialog() {
      this.uploadForm.attachmentList = []
      this.uploadLoading = false
    },
    showUpload() {
      this.visible = true
    },
    handleClose() {
      this.visible = false
    },
    onSubmit() {
      this.uploadLoading = true
      const { attachmentList } = this.uploadForm
      const { id } = this.$route.params
      const params = {
        attachmentList,
        id
      }
      this.$refs['uploadForm'].validate(async bool => {
        if (bool) {
          // 上传附件操作
          await uploadAttachment(params)
          this.uploadLoading = false
          this.$message({
            type: 'success',
            message: '上传成功'
          })
          this.handleClose()
          this.rePainDetail()
        } else {
          return false
        }
      })
    },
    rePainDetail() {
      const { id } = this.$route.params
      this.$emit('reviewDetail', id)
    },
    setFileListHandle(list) {
      this.uploadForm.attachmentList = list
    },
    closeDialogVisible() {
      this.visible = false
    },
    setUploadLoding(loading) {
      this.uploadLoading = loading
    },
    getProductSummaries(param) {
      const { columns, data } = param
      const sums = []
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '总计'
          return
        }
        if (index === 1 || index === 2 || index === 3 || index === 4) {
          sums[index] = ''
          return
        }
        const values = data.map(item => Number(item[column.property]))
        if (!values.every(value => isNaN(value))) {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr)
            if (!isNaN(value)) {
              return prev + curr
            } else {
              return prev
            }
          }, 0)
        }
      })
      sums[6] = `${this.data.currencyCode} ${formatMoneyAmount(sums[6])}`
      return sums
    },
    getOrderSummaries(param) {
      const { columns, data } = param
      const sums = []
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '总计'
          return
        }
        if (index === 1 || index === 2 || index === 3) {
          sums[index] = ''
          return
        }
        const values = data.map(item => Number(item[column.property]))
        if (!values.every(value => isNaN(value))) {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr)
            if (!isNaN(value)) {
              return prev + curr
            } else {
              return prev
            }
          }, 0)
        }
      })
      sums[4] = `${this.data.currencyCode} ${formatMoneyAmount(sums[4])}`
      return sums
    },
    async initCreditInfo() {
      const { companyId } = this.data
      let data = await getCreditInfo({ companyId })
      data = data || {}
      let {
        sinosureQuotaAmount,
        approvedSinosureAmount,
        notApprovedSinosureAmount,
        sinosureBalanceAmount,
        sinosureExpiryTime,
        creditQuotaAmount,
        approvedCreditAmount,
        notApprovedCreditAmount,
        creditBalanceAmount,
        creditExpiryTime
      } = data
      sinosureQuotaAmount = formatMoneyAmount(sinosureQuotaAmount)
      approvedSinosureAmount = formatMoneyAmount(approvedSinosureAmount)
      notApprovedSinosureAmount = formatMoneyAmount(notApprovedSinosureAmount)
      sinosureBalanceAmount = formatMoneyAmount(sinosureBalanceAmount)
      sinosureExpiryTime = isUndefined(sinosureExpiryTime) ? '' : formatTime(sinosureExpiryTime, 'YYYY-MM-DD')
      creditQuotaAmount = formatMoneyAmount(creditQuotaAmount)
      approvedCreditAmount = formatMoneyAmount(approvedCreditAmount)
      notApprovedCreditAmount = formatMoneyAmount(notApprovedCreditAmount)
      creditBalanceAmount = formatMoneyAmount(creditBalanceAmount)
      creditExpiryTime = isUndefined(creditExpiryTime) ? '' : formatTime(creditExpiryTime, 'YYYY-MM-DD')
      const arr = [
        '',
        sinosureQuotaAmount,
        getEngross(approvedSinosureAmount, notApprovedSinosureAmount),
        sinosureBalanceAmount,
        sinosureExpiryTime,
        '',
        creditQuotaAmount,
        getEngross(approvedCreditAmount, notApprovedCreditAmount),
        creditBalanceAmount,
        creditExpiryTime
      ]
      arr.forEach((item, index) => {
        this.creditInfo[index].value = item
      })
    },
    initPaymentInfo() {
      const { applyPaymentOutDTO } = this.data
      this.applyPaymentOutDTO = applyPaymentOutDTO
    },
    amountAndCurrenyHandler(currency, amount) {
      let text = ''
      if (!amount) {
        text = `${currency} 0.00`
      } else {
        text = `${currency} ${formatMoneyAmount(amount)}`
      }
      return text
    },
    percentAmount(amount) {
      let text = ''
      if (!amount) {
        text = '0%'
      } else {
        text = `${amount}%`
      }
      return text
    },
    checkingStatusText(checkingStatus, list = []) {
      const item = list.find(it => +it.value === +checkingStatus) || {}
      return item.label
    },
    changeRecord() {
      this.changeRecordVisble = true
    },
    closeChangeDialog() {
      this.changeRecordVisble = false
    },
    pageChangeHandle(pageIndex) {
      this.pageInfo.pageIndex = pageIndex
      this.handleRecordList()
    },
    async handleRecordList() {
      const { id } = this.data
      const { pageIndex, pageSize } = this.pageInfo
      const param = {
        deliveryApplyId: id,
        pageNum: pageIndex,
        pageSize: pageSize
      }
      this.changeListLoading = true
      const { records, total } = await deliveryRecordList(param).finally(() => {
        this.changeListLoading = false
      })
      this.changeList = records || []
      this.pageInfo.total = total
    }
  }
}
</script>

<style scoped lang="scss">
  .basic-container {
    .delivery-info{
      margin-top: 22px;
      font-size: 14px;
      padding: 0 6px;
    }

    .highlight-font {
      background-color: yellow;
    }
  }
</style>
